/*
 * @Descripttion: 
 * @Author: voanit
 * @Date: 2022-09-03 09:01:44
 * @LastEditors: voanit
 * @LastEditTime: 2022-09-06 18:11:32
 */

export { }
let age1: number | string = '18'
/* 类型注解 */
var arr: number[] = [1, 2, 3]
var arr2: Array<number> = [1, 2, 3]

/* 联合类型 */
var arr3: (number | string | number[])[] = [1, 2, 3, '4', [5]]
var arr4: Array<number | string | Array<number>> = [1, 2, 3, '4', [5]]

/* 类型别名 */
type Ns = number | string

let age2: Ns = '18'

type Arr = Array<number>
var arr5: Arr = [1, 2, 3]

/* 函数类型 */

/* 单独指定参数、返回值的类型： */
function add(num1: number, num2: number): boolean {
  return true
}

const add2 = (num1: number, num2: number): string => {
  return num1 + num2 + ''
}

/* 同时指定参数、返回值的类型: */
type AddFn = (num1: number, num2: number) => void
const add3: AddFn = (num1, num2) => {
  return num1 + num2
}


const add4 = (): void => {

}
// console.log(add4());  undefined====值

/* 可选参数 */
const add5 = (num1?: number, num2?: number): string => {
  return '123'
}

add5()

// let name?: string = 'jack'  错误
var obj: {
  id: number,
  name?: string,
  fn: () => void,
  fn2(): void
} = {
  id: 1,
  fn: () => {
    // return {}
  },
  fn2: () => { }
}

type Obj = {
  id: number | string
  name?: string
  fn?: () => void
  fn2(): void
  arr?: number[]
  arr2?: Array<number>
}
var obj2: Obj = {
  id: 1,
  // fn: () => {},
  fn2() { }
}

/* 接口interface */
interface IPerson {
  id?: number
  name: string
}
const person: IPerson = {
  // id: 1,
  name: 'rose'
}

/* 接口继承 */
interface IPoint2D {
  X: number
  Y: number
}
interface IPoint3D extends IPoint2D {
  Z: number
}
const obj3: IPoint3D = {
  X: 1,
  Y: 2,
  Z: 3
}

/* 元组类型 */
// let position: number[] = [116.2317, 39.5427, 2222, 3333]
let position2: [number, number] = [116.2317, 39.5427]

/* 类型推论 */
let age = 18

const f1 = () => {
  return
}

/* 字面量类型 */
let str1 = 'Hello TS'
const str2 = 'Hello TS'
const str3 = true

type Direction = 'up' | 'down' | 'left' | 'right'
function changeDirection(direction: Direction) {
  console.log(direction)
}

type P = '男' | '女'
const obj6: {
  gender: P
} = {
  gender: '女'
}

changeDirection('up')


const obj11 = {
  id: 1,
  name: 'rose',
  hobby: ['游泳', '旅游']
}

/* 枚举类型  */
enum Direction2 {
  Up = 'up', Down = 'down', Left = 'left', Right = 'right'
}
function changeDirection2(direction: Direction2) {
  console.log(direction);
}

changeDirection2(Direction2.Left)
/* any */
let num1: any = {
  id: 1
}
num1.bar = 100
num1.id = "100"
// 类型断言 
const aLink = document.getElementById('link') as HTMLAnchorElement
const img = document.querySelector('img') as HTMLImageElement
const div = document.querySelector('div') as HTMLDivElement
type HP = {
  id: number,
  name: string
}
const obj12: HP = {
  id: 1,
  name: 'jack'
}
const obj13 = {} as HP

/* 泛型 */

function handle3(a: number): number {
  return a
}
handle3(10)

// function handle4<T>(a: T): T {
//   // console.log(a.length);
//   return a
// }

// // handle4(6)
// handle4('123')

// function handle5<T>(a: T[]): T[] {
//   console.log(a.length);
//   return a
// }

// // handle4(6)
// handle4(['123'])


// function handle4<T>(a: T[]): T[] {
//   console.log(a.length);  //[10]

//   return a
// }
// // handle4<number>(10)
// handle4([10])

// type S = { length: number, push: number[] }
// // interface S { length: number }
// function handle5<T extends S>(a: T): T {
//   console.log(a.length);   //{length:number}
//   console.log(a.push);   //{length:number}
//   return a
// }

// handle5({ length: 222, push: [12] })

/* keyof===键 */
type S1 = {
  id: number,
  name: string
}
// function handle6<T extends S1>(value: T): T {
//   return value
// }
// handle6({ id: 1, name: 'jack' })
function handle6<T extends keyof S1>(value: T): T {
  return value
}
 handle6('id')

/* typeof ====获取数据的类型===类型推论  */

const S1 = {
  id: 1,
  name: 'rose',
  list: [{
    id: 11,
    message: '1122'
  }]
}
type ss = typeof S1